<!DOCTYPE html>
<!-- saved from url=(0023)http://127.0.0.1:5000/a -->
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>三张图数据可视化</title>
    <script src="https://cdn.jsdelivr.net/npm/echarts@5.0.2/dist/echarts.min.js"></script>
</head>
<body>


    <div id="a" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 161, 255);"></div>
    <div id="s" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 255, 127);"></div>
    <div id="d" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(206, 255, 127);"></div>
    <div id="main" style="width: 1200px; height: 800px; margin: 0px auto; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1616394405924"><div style="position: relative; width: 1200px; height: 800px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1320" height="880" style="position: absolute; left: 0px; top: 0px; width: 1200px; height: 800px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class=""></div></div>
    <script type="text/javascript">
    var mycharts = echarts.init(document.getElementById('main'));
    var namedata = [ '布拉德利  比尔',  '乔尔 恩比德',  '达米安 利拉德',  '斯蒂芬 库里',  '扬尼斯 安特托昆博',  '凯文 杜兰特',  '卢卡 东契奇',  '扎克 拉文',  '凯里 欧文',  '尼古拉 约基奇',  'CJ 麦科勒姆',  '科怀 伦纳德',  '特雷 杨',  '勒布朗 詹姆斯',  '锡安 威廉姆森',  '德文 布克',  '杰森 塔图姆',  '詹姆斯 哈登',  '尼古拉 武切维奇',  '多诺万 米切尔',  '杰伦 布朗',  '谢伊 吉尔杰斯-亚历山大',  '布兰登 英格拉姆',  '科林 塞克斯顿',  '达龙 福克斯',  '杰拉米 格兰特',  '朱利叶斯 兰德尔',  '保罗 乔治',  '安东尼 戴维斯',  '克里斯蒂安 伍德',  '卡尔-安东尼 唐斯',  '马尔科姆 布罗格登',  '吉米 巴特勒',  '拉塞尔 威斯布鲁克',  '戈登 海沃德',  '约翰 沃尔',  '贾马尔 穆雷',  '克里斯塔普斯 波尔津吉斯',  '马利克 比斯利',  '多曼塔斯 萨博尼斯',  '克里斯 米德尔顿',  '特里 罗齐尔',  '德马尔 德罗赞',  '维克托 奥拉迪波',  '托拜厄斯 哈里斯',  '帕斯卡尔 西亚卡姆',  '弗雷德 范弗里特',  '贾 莫兰特',  '丹吉洛 拉塞尔',  '巴姆 阿德巴约', ];
    var tppctdata = [  34,   42,   39,   41,   30,   43,   35,   44,   42,   41,   44,   40,   38,   36,   32,   36,   38,   38,   42,   38,   38,   42,   38,   38,   34,   35,   42,   44,   29,   42,   36,   39,   21,   32,   41,   34,   39,   37,   41,   32,   42,   43,   32,   32,   40,   30,   38,   25,   40,   33, ];
    var efficiencydata = [  28,   34,   28,   28,   34,   30,   30,   26,   27,   37,   25,   28,   25,   28,   26,   21,   24,   32,   29,   20,   22,   24,   23,   18,   21,   20,   28,   24,   26,   26,   27,   22,   28,   24,   22,   17,   20,   23,   18,   28,   23,   19,   24,   18,   23,   22,   21,   19,   16,   27, ];
    var ftpctdata = [  90,   86,   93,   93,   68,   87,   75,   86,   88,   87,   84,   88,   87,   69,   69,   85,   86,   87,   85,   82,   76,   81,   88,   80,   68,   87,   80,   88,   72,   69,   88,   89,   85,   58,   87,   74,   85,   84,   85,   72,   89,   84,   88,   75,   89,   82,   89,   78,   75,   85, ];
    var pointsPgdata = [  32,   30,   30,   29,   29,   29,   28,   28,   28,   27,   27,   26,   26,   26,   26,   25,   25,   25,   25,   25,   24,   24,   24,   24,   24,   23,   23,   23,   22,   22,   22,   22,   21,   21,   21,   21,   21,   21,   20,   20,   20,   20,   20,   20,   20,   20,   20,   20,   19,   19, ];
    var option = {
        backgroundColor:'rgba(242, 120, 32, 1)',
        title: {
            text:'折线图',
            left:'center',
                },
        tooltip: {},
        legend:{data:['tppct','efficiency','ftpct','pointsPg'],
                bottom:'0'},
        xAxis:{data:namedata},
        yAxis:{
            type: 'value'
        },
        series:[
            {
            name:'tppct',
            type:'line',
            data:tppctdata,
            showSymbol: false,

            smooth:true
            },
            {
            name:'efficiency',
            type:'line',
            data:efficiencydata,
            showSymbol: false,

            smooth:true
            },
            {
            name:'ftpct',
            type:'line',
            data:ftpctdata,
            showSymbol: false,

            smooth:true
            },
            {
            name:'pointsPg',
            type:'line',
            data:pointsPgdata,
            showSymbol: false,

            smooth:true
            },
        ]
        };
        mycharts.setOption(option)
    </script>


    <div id="a" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 161, 255);"></div>
    <div id="s" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 255, 127);"></div>
    <div id="d" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(206, 255, 127);"></div>
    <div id="asdf" style="width: 1200px; height: 800px; margin: 0px auto; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1616394405925"><div style="position: relative; width: 1200px; height: 800px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1320" height="880" style="position: absolute; left: 0px; top: 0px; width: 1200px; height: 800px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class="" style="position: absolute; display: block; border-style: solid; white-space: nowrap; z-index: 9999999; box-shadow: rgba(0, 0, 0, 0.2) 1px 2px 10px; transition: opacity 0.2s cubic-bezier(0.23, 1, 0.32, 1) 0s, visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1) 0s, left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgb(255, 255, 255); border-width: 1px; border-radius: 4px; color: rgb(102, 102, 102); font: 14px / 21px &quot;Microsoft YaHei&quot;; padding: 10px; left: 191px; top: 560px; border-color: rgb(250, 200, 88); pointer-events: none; visibility: hidden; opacity: 0;"><div style="margin: 0px 0 0;line-height:1;"><div style="font-size:14px;color:#666;font-weight:400;line-height:1;">ftpct</div><div style="margin: 10px 0 0;line-height:1;"><div style="margin: 0px 0 0;line-height:1;"><span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:#fac858;"></span><span style="font-size:14px;color:#666;font-weight:400;margin-left:2px">达米安 利拉德</span><span style="float:right;margin-left:20px;font-size:14px;color:#666;font-weight:900">93</span><div style="clear:both"></div></div><div style="clear:both"></div></div><div style="clear:both"></div></div></div></div>
    <script type="text/javascript">
    var mycharts = echarts.init(document.getElementById('asdf'));
    var namedata = [ '布拉德利  比尔',  '乔尔 恩比德',  '达米安 利拉德',  '斯蒂芬 库里',  '扬尼斯 安特托昆博',  '凯文 杜兰特',  '卢卡 东契奇',  '扎克 拉文',  '凯里 欧文',  '尼古拉 约基奇',  'CJ 麦科勒姆',  '科怀 伦纳德',  '特雷 杨',  '勒布朗 詹姆斯',  '锡安 威廉姆森',  '德文 布克',  '杰森 塔图姆',  '詹姆斯 哈登',  '尼古拉 武切维奇',  '多诺万 米切尔',  '杰伦 布朗',  '谢伊 吉尔杰斯-亚历山大',  '布兰登 英格拉姆',  '科林 塞克斯顿',  '达龙 福克斯',  '杰拉米 格兰特',  '朱利叶斯 兰德尔',  '保罗 乔治',  '安东尼 戴维斯',  '克里斯蒂安 伍德',  '卡尔-安东尼 唐斯',  '马尔科姆 布罗格登',  '吉米 巴特勒',  '拉塞尔 威斯布鲁克',  '戈登 海沃德',  '约翰 沃尔',  '贾马尔 穆雷',  '克里斯塔普斯 波尔津吉斯',  '马利克 比斯利',  '多曼塔斯 萨博尼斯',  '克里斯 米德尔顿',  '特里 罗齐尔',  '德马尔 德罗赞',  '维克托 奥拉迪波',  '托拜厄斯 哈里斯',  '帕斯卡尔 西亚卡姆',  '弗雷德 范弗里特',  '贾 莫兰特',  '丹吉洛 拉塞尔',  '巴姆 阿德巴约', ];
    var tppctdata = [  34,   42,   39,   41,   30,   43,   35,   44,   42,   41,   44,   40,   38,   36,   32,   36,   38,   38,   42,   38,   38,   42,   38,   38,   34,   35,   42,   44,   29,   42,   36,   39,   21,   32,   41,   34,   39,   37,   41,   32,   42,   43,   32,   32,   40,   30,   38,   25,   40,   33, ];
    var efficiencydata = [  28,   34,   28,   28,   34,   30,   30,   26,   27,   37,   25,   28,   25,   28,   26,   21,   24,   32,   29,   20,   22,   24,   23,   18,   21,   20,   28,   24,   26,   26,   27,   22,   28,   24,   22,   17,   20,   23,   18,   28,   23,   19,   24,   18,   23,   22,   21,   19,   16,   27, ];
    var ftpctdata = [  90,   86,   93,   93,   68,   87,   75,   86,   88,   87,   84,   88,   87,   69,   69,   85,   86,   87,   85,   82,   76,   81,   88,   80,   68,   87,   80,   88,   72,   69,   88,   89,   85,   58,   87,   74,   85,   84,   85,   72,   89,   84,   88,   75,   89,   82,   89,   78,   75,   85, ];
    var pointsPgdata = [  32,   30,   30,   29,   29,   29,   28,   28,   28,   27,   27,   26,   26,   26,   26,   25,   25,   25,   25,   25,   24,   24,   24,   24,   24,   23,   23,   23,   22,   22,   22,   22,   21,   21,   21,   21,   21,   21,   20,   20,   20,   20,   20,   20,   20,   20,   20,   20,   19,   19, ];
    var option = {
        backgroundColor:'rgba(209, 241, 5, 1)',
        title: {
            text:'柱状图',
            left:'center',
                },
        tooltip: {},
        legend:{data:['tppct','efficiency','ftpct','pointsPg'],
                bottom:'0'},
        xAxis:{data:namedata},
        yAxis:{
            type: 'value'
        },
        series:[
            {
            name:'tppct',
            type:'bar',
            data:tppctdata,
            },
            {
            name:'efficiency',
            type:'bar',
            data:efficiencydata,
            },
            {
            name:'ftpct',
            type:'bar',
            data:ftpctdata,
            },
            {
            name:'pointsPg',
            type:'bar',
            data:pointsPgdata,
            },
        ]
        };
        mycharts.setOption(option)
    </script>


    <div id="a" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 161, 255);"></div>
    <div id="s" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 255, 127);"></div>
    <div id="d" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(206, 255, 127);"></div>
    <div id="qwer" style="width: 1200px; height: 800px; margin: 0px auto; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1616394405926"><div style="position: relative; width: 1200px; height: 800px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1320" height="880" style="position: absolute; left: 0px; top: 0px; width: 1200px; height: 800px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div class="" style="position: absolute; display: block; border-style: solid; white-space: nowrap; z-index: 9999999; box-shadow: rgba(0, 0, 0, 0.2) 1px 2px 10px; transition: opacity 0.2s cubic-bezier(0.23, 1, 0.32, 1) 0s, visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1) 0s, left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgb(255, 255, 255); border-width: 1px; border-radius: 4px; color: rgb(102, 102, 102); font: 14px / 21px &quot;Microsoft YaHei&quot;; padding: 10px; left: 240px; top: 709px; border-color: rgb(234, 124, 204); pointer-events: none; visibility: hidden; opacity: 0;"><div style="margin: 0px 0 0;line-height:1;"><div style="font-size:14px;color:#666;font-weight:400;line-height:1;">efficiency</div><div style="margin: 10px 0 0;line-height:1;"><div style="margin: 0px 0 0;line-height:1;"><span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:#ea7ccc;"></span><span style="font-size:14px;color:#666;font-weight:400;margin-left:2px">朱利叶斯 兰德尔</span><span style="float:right;margin-left:20px;font-size:14px;color:#666;font-weight:900">28</span><div style="clear:both"></div></div><div style="clear:both"></div></div><div style="clear:both"></div></div></div></div>
    <script type="text/javascript">
    var mycharts = echarts.init(document.getElementById('qwer'));
    var tppctdata = [ {value:34,name:'布拉德利  比尔'},  {value:42,name:'乔尔 恩比德'},  {value:39,name:'达米安 利拉德'},  {value:41,name:'斯蒂芬 库里'},  {value:30,name:'扬尼斯 安特托昆博'},  {value:43,name:'凯文 杜兰特'},  {value:35,name:'卢卡 东契奇'},  {value:44,name:'扎克 拉文'},  {value:42,name:'凯里 欧文'},  {value:41,name:'尼古拉 约基奇'},  {value:44,name:'CJ 麦科勒姆'},  {value:40,name:'科怀 伦纳德'},  {value:38,name:'特雷 杨'},  {value:36,name:'勒布朗 詹姆斯'},  {value:32,name:'锡安 威廉姆森'},  {value:36,name:'德文 布克'},  {value:38,name:'杰森 塔图姆'},  {value:38,name:'詹姆斯 哈登'},  {value:42,name:'尼古拉 武切维奇'},  {value:38,name:'多诺万 米切尔'},  {value:38,name:'杰伦 布朗'},  {value:42,name:'谢伊 吉尔杰斯-亚历山大'},  {value:38,name:'布兰登 英格拉姆'},  {value:38,name:'科林 塞克斯顿'},  {value:34,name:'达龙 福克斯'},  {value:35,name:'杰拉米 格兰特'},  {value:42,name:'朱利叶斯 兰德尔'},  {value:44,name:'保罗 乔治'},  {value:29,name:'安东尼 戴维斯'},  {value:42,name:'克里斯蒂安 伍德'},  {value:36,name:'卡尔-安东尼 唐斯'},  {value:39,name:'马尔科姆 布罗格登'},  {value:21,name:'吉米 巴特勒'},  {value:32,name:'拉塞尔 威斯布鲁克'},  {value:41,name:'戈登 海沃德'},  {value:34,name:'约翰 沃尔'},  {value:39,name:'贾马尔 穆雷'},  {value:37,name:'克里斯塔普斯 波尔津吉斯'},  {value:41,name:'马利克 比斯利'},  {value:32,name:'多曼塔斯 萨博尼斯'},  {value:42,name:'克里斯 米德尔顿'},  {value:43,name:'特里 罗齐尔'},  {value:32,name:'德马尔 德罗赞'},  {value:32,name:'维克托 奥拉迪波'},  {value:40,name:'托拜厄斯 哈里斯'},  {value:30,name:'帕斯卡尔 西亚卡姆'},  {value:38,name:'弗雷德 范弗里特'},  {value:25,name:'贾 莫兰特'},  {value:40,name:'丹吉洛 拉塞尔'},  {value:33,name:'巴姆 阿德巴约'}, ];
    var efficiencydata = [  {value:28,name:'布拉德利  比尔'},   {value:34,name:'乔尔 恩比德'},   {value:28,name:'达米安 利拉德'},   {value:28,name:'斯蒂芬 库里'},   {value:34,name:'扬尼斯 安特托昆博'},   {value:30,name:'凯文 杜兰特'},   {value:30,name:'卢卡 东契奇'},   {value:26,name:'扎克 拉文'},   {value:27,name:'凯里 欧文'},   {value:37,name:'尼古拉 约基奇'},   {value:25,name:'CJ 麦科勒姆'},   {value:28,name:'科怀 伦纳德'},   {value:25,name:'特雷 杨'},   {value:28,name:'勒布朗 詹姆斯'},   {value:26,name:'锡安 威廉姆森'},   {value:21,name:'德文 布克'},   {value:24,name:'杰森 塔图姆'},   {value:32,name:'詹姆斯 哈登'},   {value:29,name:'尼古拉 武切维奇'},   {value:20,name:'多诺万 米切尔'},   {value:22,name:'杰伦 布朗'},   {value:24,name:'谢伊 吉尔杰斯-亚历山大'},   {value:23,name:'布兰登 英格拉姆'},   {value:18,name:'科林 塞克斯顿'},   {value:21,name:'达龙 福克斯'},   {value:20,name:'杰拉米 格兰特'},   {value:28,name:'朱利叶斯 兰德尔'},   {value:24,name:'保罗 乔治'},   {value:26,name:'安东尼 戴维斯'},   {value:26,name:'克里斯蒂安 伍德'},   {value:27,name:'卡尔-安东尼 唐斯'},   {value:22,name:'马尔科姆 布罗格登'},   {value:28,name:'吉米 巴特勒'},   {value:24,name:'拉塞尔 威斯布鲁克'},   {value:22,name:'戈登 海沃德'},   {value:17,name:'约翰 沃尔'},   {value:20,name:'贾马尔 穆雷'},   {value:23,name:'克里斯塔普斯 波尔津吉斯'},   {value:18,name:'马利克 比斯利'},   {value:28,name:'多曼塔斯 萨博尼斯'},   {value:23,name:'克里斯 米德尔顿'},   {value:19,name:'特里 罗齐尔'},   {value:24,name:'德马尔 德罗赞'},   {value:18,name:'维克托 奥拉迪波'},   {value:23,name:'托拜厄斯 哈里斯'},   {value:22,name:'帕斯卡尔 西亚卡姆'},   {value:21,name:'弗雷德 范弗里特'},   {value:19,name:'贾 莫兰特'},   {value:16,name:'丹吉洛 拉塞尔'},   {value:27,name:'巴姆 阿德巴约'}, ];
    var ftpctdata = [  {value:90,name:'布拉德利  比尔'},   {value:86,name:'乔尔 恩比德'},   {value:93,name:'达米安 利拉德'},   {value:93,name:'斯蒂芬 库里'},   {value:68,name:'扬尼斯 安特托昆博'},   {value:87,name:'凯文 杜兰特'},   {value:75,name:'卢卡 东契奇'},   {value:86,name:'扎克 拉文'},   {value:88,name:'凯里 欧文'},   {value:87,name:'尼古拉 约基奇'},   {value:84,name:'CJ 麦科勒姆'},   {value:88,name:'科怀 伦纳德'},   {value:87,name:'特雷 杨'},   {value:69,name:'勒布朗 詹姆斯'},   {value:69,name:'锡安 威廉姆森'},   {value:85,name:'德文 布克'},   {value:86,name:'杰森 塔图姆'},   {value:87,name:'詹姆斯 哈登'},   {value:85,name:'尼古拉 武切维奇'},   {value:82,name:'多诺万 米切尔'},   {value:76,name:'杰伦 布朗'},   {value:81,name:'谢伊 吉尔杰斯-亚历山大'},   {value:88,name:'布兰登 英格拉姆'},   {value:80,name:'科林 塞克斯顿'},   {value:68,name:'达龙 福克斯'},   {value:87,name:'杰拉米 格兰特'},   {value:80,name:'朱利叶斯 兰德尔'},   {value:88,name:'保罗 乔治'},   {value:72,name:'安东尼 戴维斯'},   {value:69,name:'克里斯蒂安 伍德'},   {value:88,name:'卡尔-安东尼 唐斯'},   {value:89,name:'马尔科姆 布罗格登'},   {value:85,name:'吉米 巴特勒'},   {value:58,name:'拉塞尔 威斯布鲁克'},   {value:87,name:'戈登 海沃德'},   {value:74,name:'约翰 沃尔'},   {value:85,name:'贾马尔 穆雷'},   {value:84,name:'克里斯塔普斯 波尔津吉斯'},   {value:85,name:'马利克 比斯利'},   {value:72,name:'多曼塔斯 萨博尼斯'},   {value:89,name:'克里斯 米德尔顿'},   {value:84,name:'特里 罗齐尔'},   {value:88,name:'德马尔 德罗赞'},   {value:75,name:'维克托 奥拉迪波'},   {value:89,name:'托拜厄斯 哈里斯'},   {value:82,name:'帕斯卡尔 西亚卡姆'},   {value:89,name:'弗雷德 范弗里特'},   {value:78,name:'贾 莫兰特'},   {value:75,name:'丹吉洛 拉塞尔'},   {value:85,name:'巴姆 阿德巴约'}, ];
    var pointsPgdata = [  {value:32,name:'布拉德利  比尔'},   {value:30,name:'乔尔 恩比德'},   {value:30,name:'达米安 利拉德'},   {value:29,name:'斯蒂芬 库里'},   {value:29,name:'扬尼斯 安特托昆博'},   {value:29,name:'凯文 杜兰特'},   {value:28,name:'卢卡 东契奇'},   {value:28,name:'扎克 拉文'},   {value:28,name:'凯里 欧文'},   {value:27,name:'尼古拉 约基奇'},   {value:27,name:'CJ 麦科勒姆'},   {value:26,name:'科怀 伦纳德'},   {value:26,name:'特雷 杨'},   {value:26,name:'勒布朗 詹姆斯'},   {value:26,name:'锡安 威廉姆森'},   {value:25,name:'德文 布克'},   {value:25,name:'杰森 塔图姆'},   {value:25,name:'詹姆斯 哈登'},   {value:25,name:'尼古拉 武切维奇'},   {value:25,name:'多诺万 米切尔'},   {value:24,name:'杰伦 布朗'},   {value:24,name:'谢伊 吉尔杰斯-亚历山大'},   {value:24,name:'布兰登 英格拉姆'},   {value:24,name:'科林 塞克斯顿'},   {value:24,name:'达龙 福克斯'},   {value:23,name:'杰拉米 格兰特'},   {value:23,name:'朱利叶斯 兰德尔'},   {value:23,name:'保罗 乔治'},   {value:22,name:'安东尼 戴维斯'},   {value:22,name:'克里斯蒂安 伍德'},   {value:22,name:'卡尔-安东尼 唐斯'},   {value:22,name:'马尔科姆 布罗格登'},   {value:21,name:'吉米 巴特勒'},   {value:21,name:'拉塞尔 威斯布鲁克'},   {value:21,name:'戈登 海沃德'},   {value:21,name:'约翰 沃尔'},   {value:21,name:'贾马尔 穆雷'},   {value:21,name:'克里斯塔普斯 波尔津吉斯'},   {value:20,name:'马利克 比斯利'},   {value:20,name:'多曼塔斯 萨博尼斯'},   {value:20,name:'克里斯 米德尔顿'},   {value:20,name:'特里 罗齐尔'},   {value:20,name:'德马尔 德罗赞'},   {value:20,name:'维克托 奥拉迪波'},   {value:20,name:'托拜厄斯 哈里斯'},   {value:20,name:'帕斯卡尔 西亚卡姆'},   {value:20,name:'弗雷德 范弗里特'},   {value:20,name:'贾 莫兰特'},   {value:19,name:'丹吉洛 拉塞尔'},   {value:19,name:'巴姆 阿德巴约'}, ];
    var option = {
        backgroundColor:'rgba(68, 225, 199, 1)',
        title: {
            text:'饼图',
            left:'40%',
                },
        
        tooltip: {},
        legend:{
            type:'scroll',
            orient: 'vertical',
            left:'80%',
            pageButtonGap:'10',
            borderColor:'#2F4F4F',
            borderRadius:7,
            width:'20%',
            height:'70%',
            top:'10%'

                },
        series:[
            {
            name:'tppct',
            type:'pie',
            
            selectedMode: 'multiple',
            label: {
                show: false
            },      
            roseType: 'radius',  
            radius:[20,120],
            center:['20%','20%'],
            itemStyle:{borderRadius:[20,20],shadowColor:'rgba(11, 169, 137, 1)',shadowBlur:7},
            data:tppctdata},

            {
            name:'efficiency',
            type:'pie',
            roseType:'radius'  ,
            radius:[20,120],
            selectedMode: 'multiple',
            label: {
                show: false
            },    
            center:['20%','80%'],
            itemStyle:{borderRadius:[20,20],shadowColor:'rgba(55, 179, 232, 1)',shadowBlur:7},
            data:efficiencydata},
            {
            name:'ftpct',
            type:'pie',
            selectedMode: 'multiple',
            label: {
                show: false
            },    
            roseType:'radius'  ,
            radius:[20,120],
            center:['60%','20%'],
            itemStyle:{borderRadius:[20,20],shadowColor:'rgba(162, 53, 234, 1)',shadowBlur:7},
            data:ftpctdata},
            {
            name:'pointsPg',
            type:'pie',
            selectedMode: 'multiple',
            label: {
                show: false
            },    
            roseType:'radius'  ,
            radius:[20,120],
            center:['60%','80%'],
            itemStyle:{borderRadius:[20,20],shadowColor:'rgba(245, 106, 20, 1)',shadowBlur:7},
            data:pointsPgdata},
        ]};
        mycharts.setOption(option)
    </script>
    
    <div id="a" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 161, 255);"></div>
    <div id="s" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 255, 127);"></div>
    <div id="d" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(206, 255, 127);"></div>
    <div id="qq" style="width: 1200px; height: 800px; margin: 0px auto; -webkit-tap-highlight-color: transparent; user-select: none;" _echarts_instance_="ec_1616394405927"><div style="position: relative; width: 1200px; height: 800px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1320" height="880" style="position: absolute; left: 0px; top: 0px; width: 1200px; height: 800px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div></div>
    <script type="text/javascript">
    var mycharts = echarts.init(document.getElementById('qq'));
    var data = [
    {
    name: 'lin',
    children: [
        {
        name: '1',
        value: 15,
        children: [{
            name: '11',
            value: 2
        }, {
            name: '12',
            value: 5,
            children: [{
                name: '123',
                value: 2
            }]
        }, {
            name: '124',
            value: 4
        }]
    },
    {
        name: '2',
        value: 10,
        children: [{
            name: '22',
            value: 5
        }, {
            name: '23',
            value: 1
        }]
    }
    ]
}];

option = {
    backgroundColor:'rgba(20, 119, 190, 1)',

    series: {
        type: 'sunburst',
        emphasis: {
            focus: 'ancestor'
        },
        data: data,
        radius: ['5%', '90%'],
        itemStyle: {
            borderRadius: 10,
            borderWidth: 2
        },
        label: {
            show: false
        },
        label: {
            rotate: 'radial'
        }
    }
};

    mycharts.setOption(option)
    </script>


    <div id="a" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 161, 255);"></div>
    <div id="s" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(127, 255, 127);"></div>
    <div id="d" style="width:1200px;height:10px;margin:0 auto;background-color: rgb(206, 255, 127);"></div>
    <div id="yu" style="width: 1200px; height: 800px; margin: 0px auto; -webkit-tap-highlight-color: transparent; user-select: none;" _echarts_instance_="ec_1616394405928"><div style="position: relative; width: 1200px; height: 800px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1320" height="880" style="position: absolute; left: 0px; top: 0px; width: 1200px; height: 800px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div></div>

    <!-- <p>[ 34,28  42,34  39,28  41,28  30,34  43,30  35,30  44,26  42,27  41,37  44,25  40,28  38,25  36,28  32,26  36,21  38,24  38,32  42,29  38,20  38,22  42,24  38,23  38,18  34,21  35,20  42,28  44,24  29,26  42,26  36,27  39,22  21,28  32,24  41,22  34,17  39,20  37,23  41,18  32,28  42,23  43,19  32,24  32,18  40,23  30,22  38,21  25,19  40,16  33,27 ]</p> -->
    <script type="text/javascript">
    
    
    var mycharts = echarts.init(document.getElementById('yu'));

    var data = [ [34,28],  [42,34],  [39,28],  [41,28],  [30,34],  [43,30],  [35,30],  [44,26],  [42,27],  [41,37],  [44,25],  [40,28],  [38,25],  [36,28],  [32,26],  [36,21],  [38,24],  [38,32],  [42,29],  [38,20],  [38,22],  [42,24],  [38,23],  [38,18],  [34,21],  [35,20],  [42,28],  [44,24],  [29,26],  [42,26],  [36,27],  [39,22],  [21,28],  [32,24],  [41,22],  [34,17],  [39,20],  [37,23],  [41,18],  [32,28],  [42,23],  [43,19],  [32,24],  [32,18],  [40,23],  [30,22],  [38,21],  [25,19],  [40,16],  [33,27], ];
    var tata = [ [90,32],  [86,30],  [93,30],  [93,29],  [68,29],  [87,29],  [75,28],  [86,28],  [88,28],  [87,27],  [84,27],  [88,26],  [87,26],  [69,26],  [69,26],  [85,25],  [86,25],  [87,25],  [85,25],  [82,25],  [76,24],  [81,24],  [88,24],  [80,24],  [68,24],  [87,23],  [80,23],  [88,23],  [72,22],  [69,22],  [88,22],  [89,22],  [85,21],  [58,21],  [87,21],  [74,21],  [85,21],  [84,21],  [85,20],  [72,20],  [89,20],  [84,20],  [88,20],  [75,20],  [89,20],  [82,20],  [89,20],  [78,20],  [75,19],  [85,19], ];

    var option = {
        // title: {
        //     text:'气泡图',
        //     center:'0',
        //         },
        title: {text:'气泡图',
                left:'50%'},
        backgroundColor:'#FDF5E6',
        xAxis:{},
        yAxis:{},
        series: [{
            type:'scatter',
            symbolSize:10,
            data:data,

        
            itemStyle: {
            shadowBlur: 10,
            shadowColor: 'rgba(25, 100, 150, 0.5)',
            shadowOffsetY: 5,
            color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [{
                offset: 0,
                color: 'rgb(129, 227, 238)'
            }, {
                offset: 1,
                color: 'rgb(25, 183, 207)'
            }])
        }
        },
        {
            type:'scatter',
            symbolSize:10,
            data:tata,

        
            itemStyle: {
            shadowBlur: 10,
            shadowColor: 'rgba(120, 36, 50, 0.5)',
            shadowOffsetY: 5,
            color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [{
                offset: 0,
                color: 'rgb(251, 118, 123)'
            }, {
                offset: 1,
                color: 'rgb(204, 46, 72)'
            }])
        }
        }]};
            
        mycharts.setOption(option)
    </script>









<div class="xl-chrome-ext-bar" id="xl_chrome_ext_{4DB361DE-01F7-4376-B494-639E489D19ED}" style="display: none;">
      <div class="xl-chrome-ext-bar__logo"></div>

      <a id="xl_chrome_ext_download" href="javascript:;" class="xl-chrome-ext-bar__option">下载视频</a>
      <a id="xl_chrome_ext_close" href="javascript:;" class="xl-chrome-ext-bar__close"></a>
    </div></body></html>